// 查询表单辅助函数

import type { TemplateFormConfig } from '#/views/onlineDesign/designPage/template/type/type';

import { querySelectTableApi } from '#/api';
import { queryDictOptionsApi } from '#/utils';
import { tableConfig } from '#/views/onlineDesign/designPage/template/tableTemplate/config';

// 组件类型
type ComponentType =
  | 'ApiSelectDict'
  | 'ApiSelectTable'
  | 'DatePicker'
  | 'Input'
  | 'InputNumber'
  | 'InputPassword'
  | 'RangePicker'
  | 'Textarea'
  | 'TimePicker';

/**
 * 将下划线分隔的字符串转换为驼峰命名
 * @param str 下划线分隔的字符串
 * @returns 驼峰命名的字符串
 */
export function toCamelCase(str: string): string {
  return str.replaceAll(/([-_][a-z])/gi, ($1) => {
    return $1.toUpperCase().replace('-', '').replace('_', '');
  });
}

// 查询表单组件类型获取
const selectFormComponentOptionFun = {
  /**
   * 获取组件类型的属性
   * @param componentType 组件类型
   * @param params 参数
   */
  getComponentOption: (componentType: ComponentType, params: any) => {
    switch (componentType) {
      // 下拉框(字典下拉)
      case 'ApiSelectDict': {
        tableConfig.selectFormConfig.baseConfig.dictSelect = true;
        return {
          ...params.commonProps,
          component: 'ApiSelect',
          componentProps: {
            ...params.componentProps,
            afterFetch: (data) =>
              data.map(({ itemText, itemVal }) => ({
                label: itemText,
                value: params.dataType ? Number.parseInt(itemVal) : itemVal,
              })),
            api: queryDictOptionsApi,
            params: { dictCode: params.dictCode },
          },
        } as TemplateFormConfig.FormComponentConfig;
      }
      // 下拉框(表下拉)
      case 'ApiSelectTable': {
        tableConfig.selectFormConfig.baseConfig.tableSelect = true;
        return {
          ...params.commonProps,
          component: 'ApiSelect',
          componentProps: {
            ...params.componentProps,
            api: querySelectTableApi,
            params: {
              tableName: params.tableName,
              labelField: params.labelField,
              valueField: params.valueField,
              sqlSelect: 'del_flag = 0',
            },
          },
        } as TemplateFormConfig.FormComponentConfig;
      }
      case 'DatePicker': {
        return {
          ...params.commonProps,
          component: 'DatePicker',
          componentProps: {
            placeholder: `请选择${params.placeholder}`,
          },
        } as TemplateFormConfig.FormComponentConfig;
      }
      // 输入框
      case 'Input': {
        return {
          ...params.commonProps,
          component: 'Input',
          componentProps: {
            placeholder: `请输入${params.placeholder}`,
          },
        } as TemplateFormConfig.FormComponentConfig;
      }
      // 数字输入框
      case 'InputNumber': {
        return {
          ...params.commonProps,
          component: 'InputNumber',
          componentProps: {
            placeholder: `请输入${params.placeholder}`,
          },
        } as TemplateFormConfig.FormComponentConfig;
      }
      // 密码框
      case 'InputPassword': {
        return {
          ...params.commonProps,
          component: 'InputPassword',
          componentProps: {
            placeholder: `请输入${params.placeholder}`,
          },
        } as TemplateFormConfig.FormComponentConfig;
      }
      case 'RangePicker': {
        return {
          ...params.commonProps,
          component: 'RangePicker',
          componentProps: {
            placeholder: `请选择${params.placeholder}`,
          },
        } as TemplateFormConfig.FormComponentConfig;
      }
      case 'TimePicker': {
        return {
          ...params.commonProps,
          component: 'TimePicker',
          componentProps: {
            placeholder: `请选择${params.placeholder}`,
          },
        } as TemplateFormConfig.FormComponentConfig;
      }
    }
  },
};

// 查询表单操作方法
export const selectFormFun = {
  /**
   * 获取查询组件类型
   * @param field 参数
   * @param commonProps 组件通用参数
   */
  getComponent: (
    field: object,
    commonProps: TemplateFormConfig.FormComponentConfig,
  ) => {
    switch (field.componentName) {
      // 下拉框(字典下拉,表下拉)
      case 'ApiSelect': {
        // （关联（0否 1是））
        if (field.fieldRelevance === 1) {
          // 是字典下拉还是表下拉
          const apiProps = {
            allowClear: true,
            placeholder: `请选择${field.fieldAnnotation}`,
          };
          // 关联模式（0关联模型 1关联字典）
          if (field.fieldRelevanceMode === 1) {
            return selectFormComponentOptionFun.getComponentOption(
              'ApiSelectDict',
              {
                commonProps,
                componentProps: apiProps,
                // 数据类型转换
                dataType: field.fieldPackagePath.includes('Integer'),
                dictCode: field.fieldRelevanceModeValKey,
              },
            );
          } else if (field.fieldRelevanceMode === 0) {
            return selectFormComponentOptionFun.getComponentOption(
              'ApiSelectTable',
              {
                commonProps,
                componentProps: apiProps,
                tableName: field.fieldRelevanceModeModelCode,
                labelField: field.fieldRelevanceModeValKey,
                valueField: field.fieldRelevanceModeModelField,
              },
            );
          }
        }
        return selectFormComponentOptionFun.getComponentOption('Input', {
          commonProps,
          placeholder: field.fieldAnnotation,
        });
      }
      case 'DatePicker': {
        return selectFormComponentOptionFun.getComponentOption('DatePicker', {
          commonProps,
          placeholder: field.fieldAnnotation,
        });
      }
      // 输入框
      case 'Input': {
        return selectFormComponentOptionFun.getComponentOption('Input', {
          commonProps,
          placeholder: field.fieldAnnotation,
        });
      }
      // 数字输入框
      case 'InputNumber': {
        return selectFormComponentOptionFun.getComponentOption('InputNumber', {
          commonProps,
          placeholder: field.fieldAnnotation,
        });
      }
      // 密码框
      case 'InputPassword': {
        return selectFormComponentOptionFun.getComponentOption(
          'InputPassword',
          {
            commonProps,
            placeholder: field.fieldAnnotation,
          },
        );
      }
      case 'RangePicker': {
        return selectFormComponentOptionFun.getComponentOption('RangePicker', {
          commonProps,
          placeholder: field.fieldAnnotation,
        });
      }
      case 'Textarea': {
        return selectFormComponentOptionFun.getComponentOption('Input', {
          commonProps,
          placeholder: field.fieldAnnotation,
        });
      }
      case 'TimePicker': {
        return selectFormComponentOptionFun.getComponentOption('TimePicker', {
          commonProps,
          placeholder: field.fieldAnnotation,
        });
      }
    }
  },
};
